<template>
	<view class="container">
		<topBarVue ref="topBarRef" @changeUpload="changeUpload" :currentIndex="currentIndex"></topBarVue>
		<view class="upload-container" :style="{height: heightScreen + 'px'}">
			<swiper class="swiper-container" :current="currentIndex" @change="currentChange">
				<swiper-item>
					<view v-if="true" class="swiper-container-item">
						<blankVue></blankVue>
					</view>
					<view v-else class="swiper-container-item">
						
					</view>
				</swiper-item>
				<swiper-item>
					<view v-if="true" class="swiper-container-item">
						<blankVue></blankVue>
					</view>
					<view v-else class="swiper-container-item">
						
					</view>
				</swiper-item>
			</swiper>
		</view>
	</view>
</template>

<script setup>
import topBarVue from './components/top_bar.vue';
import blankVue from './components/blank.vue';
import { computed, onMounted, ref } from 'vue';

const heightScreen = computed(() => {
	return uni.getSystemInfoSync().screenHeight - 40
})

const topBarRef = ref(null)
const currentIndex = ref(0)
const changeUpload = (index) => {
	currentIndex.value = index.currentIndex
}
const currentChange = (event) => {
	currentIndex.value = event.detail.current
}
</script>

<style lang="scss" scoped>
.upload-container{
	height: 100%;
	.swiper-container{
		height: 100%;
		.swiper-container-item{
			height: 100%;
		}
	}
}
</style>